import React from 'react'
import '../../asset/css/merchantInfo/shop.css'
import $ from 'jquery'
class Shop extends React.Component {
    
    componentDidMount() {
        this.props.getList1()
    }

    render() {
        const { product } = this.props
        let lists = product
        // console.log(lists)
        const { Add,Del } = this.props
        return (
            <div className='shop'>
                <div className="shop_left">
                    <ul className="list">
                        {
                            lists.map((iteam, index) => <li key={index} ><a href={"#" + "sp" + index} name={"sp" + index}> {iteam.name}</a></li>
                            )
                        }
                        {/* <li><img src={require('../../asset/icon/29_rexiao.png')} alt="热销"/><span>热销</span></li>
                    <li><img src={require('../../asset/icon/youhui.png')} alt="优惠"/><span>优惠</span></li>
                     */}
                    </ul>
                </div>
                <div className="shop_right">
                    {lists.map((item, index1) => {
                        return (
                            <div key={index1} className='shop_right_title'>
                                <div className="shop_right_title1" name={"sp" + index1} id={"#" + "sp" + index1}>
                                    <strong>{item.name}</strong>
                                    {/* <span>大家喜欢</span> */}
                                </div>
                                {
                                    item.foods.map((val, index3) => {
                                        return (
                                            <div key={index3} className="food">
                                                <div className="food_img">
                                                    <img src={val.image} alt="" />
                                                </div>
                                                <div className="food_introduce">
                                                    <h2>{val.name}</h2>
                                                    <span>{val.info}</span>
                                                    <span>月售{val.sellCount}份 好评率{val.rating}%</span>
                                                    <strong>￥{val.price}</strong>
                                                    <i onClick={() => Add({"listItem":item,productItem:val})} className="plu"></i>
                                                    {val.count? <i onClick={()=>Del({"listItem1":item,productItem1:val})} className="sub"></i>:''}
                                                    {val.count? <small>{val.count}</small>:''}
                                                </div>
                                            </div>
                                        )
                                    })
                                }
                            </div>
                        )
                    })
                    }
                </div>
            </div>

        )
    }
}


export default Shop;

